<template>
  <div>
    <ul>
      <span v-for="(item,index) in emojis" :key="index" @click="output(index)">
      {{ item }}
    </span>
    </ul>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        emojis: 
        ['😀', '😄', '😅', '🤣', '😂', '😉', '😊', '😍', '😘', '😜',
  '😝', '😏', '😒', '🙄', '😔', '😴', '😷', '🤮',, '😎',
  '😮', '😰', '😭', '😱', '😩', '😡', '💀', '👽', '🤓', 
  '😺', '😹', '😻', '🤚', '💩', '👍', '👎', '👏', '🙏', '💪']
      }
    },   
    methods: {
      output(i) {
        console.log(this.emojis[i]);
      }
    }, 
  }
</script>

<style lang="scss" scoped>
ul{
  position: fixed;
  top:602px;
  background-color: white;
  padding: 2px;
}
</style>